<%--@elvariable id="user" type="com.genghis.ptas.security.entity.User"--%>
<%--@elvariable id="isLogin" type="java.lang"--%>
<%--@elvariable id="isSystem" type="java.lang"--%>
<%--@elvariable id="notLogin" type="java.lang"--%>
<%--@elvariable id="countNote" type="java.lang"--%>
<%--@elvariable id="countRegisterCourse" type="java.lang"--%>
<%--@elvariable id="countCollectCourse" type="java.lang"--%>
<%--@elvariable id="countUploadCourse" type="java.lang"--%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ page contentType="text/html;charset=UTF-8" isELIgnored="false" %>
<div class="header navbar navbar-fixed-top" style="height: 50px">
<div class="header-inner">
<a class="navbar-brand" href="javascript:" onclick="addTab('public/menu')">
    <img src="img/logo/logo_2.png" style="width: 110px;height: 30px" alt="logo" class="img-responsive"/>
</a>
<ul class="nav navbar-nav pull-right">
    <shiro:notAuthenticated>
        <li id="header_inbox_bar">
            <a href="javascript:" onclick="reLoad('login')">
                <span style="font-size: 20px">登录</span>
            </a>
        </li>
        <li id="header_notification_bar">
            <a href="javascript:" onclick="reLoad('public/register')">
                <span style="font-size: 20px">注册</span>
            </a>
        </li>
    </shiro:notAuthenticated>

    <input type="hidden" value="${isLogin}" id="hasUser">

    <shiro:authenticated>
        <li class="dropdown" id="home">
            <a href="javascript:" title="上传课件" style="width: 44px;height: 50px;"
               onclick="uploadCourseDo()"
               class="dropdown-toggle">
                <i class="fa fa-upload" style="margin-top: 3px" title="上传课件"></i>
            </a>
        </li>
        <shiro:hasRole name="用户">
            <li class="dropdown" id="home">
                <a href="javascript:" title="回首页" style="width: 44px;height: 50px"
                   onclick="browserSizeDeal(document.documentElement.clientHeight - 43);addTab('public/menu')"
                   class="dropdown-toggle"
                   data-toggle="dropdown"
                   data-hover="dropdown" data-close-others="false">
                    <i class="fa fa-home" style="margin-top: 3px"></i>
                </a>
            </li>
            <!-- BEGIN INBOX DROPDOWN -->
            <li class="dropdown" id="header_inbox_bar">
                <a href="#" class="dropdown-toggle" title="最新注册" style="height: 50px" data-toggle="dropdown"
                   data-hover="dropdown"
                   data-close-others="true">
                    <i class="fa fa-heart" style="margin-top: 3px"></i>
                    <span class="badge" id="countRegister">0</span>
                </a>
                <ul class="dropdown-menu extended inbox">
                    <li>
                        <p>
                            本周注册课件
                        </p>
                    </li>
                    <li>
                        <ul class="dropdown-menu-list scroller" id="topRegister" style="height: 250px;">
                        </ul>
                    </li>
                    <li class="external">
                        <a href="javascript:void(0);" onclick="addTab('person/myCenter?showNo=3')">
                            更多 <i class="m-icon-swapright"></i>
                        </a>
                    </li>
                </ul>
            </li>
            <!-- END INBOX DROPDOWN -->
            <!-- BEGIN INBOX DROPDOWN -->
            <li class="dropdown" id="header_friend_bar">
                <a href="#" class="dropdown-toggle" title="我的好友" style="height: 50px" data-toggle="dropdown"
                   data-hover="dropdown"
                   data-close-others="true">
                    <i class="fa fa-users" style="margin-top: 3px"></i>
                    <span class="badge" id="countFriend">0</span>
                </a>
                <ul class="dropdown-menu extended inbox">
                    <li>
                        <p id="showCountFriend">
                            你当前有1个好友
                        </p>
                    </li>
                    <li class="sidebar-search-wrapper">
                        <!-- BEGIN RESPONSIVE QUICK SEARCH FORM -->
                        <form>
                            <div class="form-container">
                                <input id="friendSelect" name="friendSelect" type="text" placeholder="好友查询..."
                                       class="form-control">
                            </div>
                        </form>
                        <!-- END RESPONSIVE QUICK SEARCH FORM -->
                    </li>
                    <li>
                        <ul class="dropdown-menu-list scroller" id="topFriends" style="height: 225px;">
                        </ul>
                    </li>
                    <li class="external">
                        <form class="sidebar-search" action="" method="POST">
                            <div class="form-container">
                                <div class="input-group">
                                    <input id="queryMoreFriend" name="queryMoreFriend" type="text"
                                           placeholder="更多查询..."
                                           class="form-control">
                                <span class="input-group-btn">
                                     <button class="btn btn-primary" type="button" style="height: 34px"
                                             onclick="queryFriendList()"><i class="fa fa-search"></i>
                                     </button>
                                </span>
                                </div>
                            </div>
                        </form>
                    </li>
                </ul>
            </li>
            <!-- END INBOX DROPDOWN -->
            <!-- BEGIN INBOX DROPDOWN -->
            <li class="dropdown" id="header_inbox_bar">
                <a href="#" class="dropdown-toggle" style="height: 50px" data-toggle="dropdown"
                   data-hover="dropdown"
                   data-close-others="true">
                    <i class="fa fa-envelope" style="margin-top: 3px"></i>
                    <span id="countInbox" class="badge">0</span>
                </a>
                <ul class="dropdown-menu extended inbox">
                    <li>
                        <p id="showCountInbox">
                            你有0条信息未读
                        </p>
                    </li>
                    <li>
                        <ul id="topInbox" class="dropdown-menu-list scroller" style="height: 250px;">
                        </ul>
                    </li>
                    <li class="external">
                        <a href="javascript:" onclick="addTab('person/myCenter?showNo=7')">
                            更多 <i class="m-icon-swapright"></i>
                        </a>
                    </li>
                </ul>
            </li>
            <!-- END INBOX DROPDOWN -->
        </shiro:hasRole>
        <li class="dropdown user" id="user">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown"
               data-close-others="true">
                <img alt="" style="width: 37px;height: 37px" id="photoUrl" src="${user.userBaseInfo.photoUrl}"/>
                <span class="username"> ${user.userName}</span>
                <i class="fa fa-angle-down"></i>
            </a>
            <ul class="dropdown-menu">
                <shiro:hasRole name="用户">
                    <li>
                        <a href="javascript:" onclick="addTab('person/myCenter?showNo=1')">
                            <i class="fa fa-user"></i> 个人中心
                        </a>
                    </li>
                </shiro:hasRole>
                <li>
                    <a href="javascript:" onclick="addTab('person/myCenter?showNo=8')">
                        <i class="fa fa-cogs"></i> 个人基本信息
                    </a>
                </li>
                <shiro:hasRole name="用户">
                    <li>
                        <a href="javascript:" onclick='addTab("person/myCenter?showNo=2")'>
                            <i class="fa fa-pencil"></i> 我的笔记
                            <span class="badge badge-danger">${countNote}</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:void(0);" onclick='addTab("person/myCenter?showNo=3")'>
                            <i class="fa fa-heart"></i> 我的注册
                            <span class="badge badge-success" id="allRegister">${countRegisterCourse}</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:void(0);" onclick='addTab("person/myCenter?showNo=4")'>
                            <i class="fa fa-star"></i> 我的收藏
                            <span class="badge badge-success" id="allCollect">${countCollectCourse}</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:void(0);" onclick='addTab("person/myCenter?showNo=5")'>
                            <i class="fa fa-upload"></i> 我的上传
                            <span class="badge badge-success">${countUploadCourse}</span>
                        </a>
                    </li>
                    <li>
                        <a href="javascript:void(0);" onclick='addTab("person/myCenter?showNo=6")'>
                            <i class="fa fa-book"></i> 学习记录
                            <span class="badge badge-success">${countUploadCourse}</span>
                        </a>
                    </li>
                </shiro:hasRole>
                <li class="divider">
                </li>
                <li>
                    <a href="javascript:" id="trigger_fullscreen">
                        <i class="fa fa-arrows"></i> 全屏
                    </a>
                </li>
                <li>
                    <a href="javascript:" onclick="reLoad('lock_screen.html?loginName=${user.loginName}')">
                        <i class="fa fa-lock"></i> 锁屏
                    </a>
                </li>
                <li>
                    <a href="javascript:" onclick="reLoad('logout')">
                        <i class="fa fa-power-off"></i> 退出
                    </a>
                </li>
            </ul>
        </li>
    </shiro:authenticated>
</ul>
</div>
</div>
<!-- END CONTAINER -->
<div class="modal fade" id="modalDialog" tabindex="-1" role="basic" aria-hidden="true" data-keyboard="false"
     data-backdrop="static">
    <div class="modal-dialog" id="topDialog" style="width: 80%">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" id="close" class="close" data-dismiss="modal" aria-hidden="true"></button>
                <h4 class="modal-title" id="dialogTitle"></h4>
            </div>
            <div class="modal-body">
                <div class="portlet-body">
                    <iframe id="userEditIframe" style="border: none;width:100%" frameBorder="0"></iframe>
                </div>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
</div>

<div class="clearfix">
</div>
<script type="text/javascript">
/** @namespace dataTemp.addresseeId */
/** @namespace dataTemp.user.userBaseInfo.photoUrl */
/** @namespace dataTemp.user.userBaseInfo */
/** @namespace dataTemp.sendDate */
/** @namespace dataTemp.registerDate */
/** @namespace dataTemp.courseName */
/** @namespace friend.friendName */
/** @namespace friend.showOnLine */
/** @namespace friend.friendPhotoUrl */
function getInnerHtml(fun, photoUrl, name, time, message, size, id) {
    return  '<li id="' + id + '">' +
            '   <a href="javascript:" onclick="' + fun + '"> ' +
            '       <span class="photo"> ' +
            '           <img src="' + photoUrl + '" style="width:' + size + 'px;height:' + size + 'px" alt=""/>' +
            '       </span> ' +
            '       <span class="subject"> ' +
            '           <span class="from">' + name + '</span> ' +
            '           <span class="time">' + time + ' </span> ' +
            '       </span> ' +
            '       <span class="message">' + message + '</span> ' +
            '   </a>  ' +
            '</li> ';
}

function getWatchCourseInnerHtml(url, photoUrl, name, time, message, size, id) {
    return  '<li id="' + id + '">' +
            '   <a href="' + url + '" target="_blank"> ' +
            '       <span class="photo"> ' +
            '           <img src="' + photoUrl + '" style="width:' + size + 'px;height:' + size + 'px" alt=""/>' +
            '       </span> ' +
            '       <span class="subject"> ' +
            '           <span class="from">' + name + '</span> ' +
            '           <span class="time">' + time + ' </span> ' +
            '       </span> ' +
            '       <span class="message">' + message + '</span> ' +
            '   </a>  ' +
            '</li> ';
}

function initTopRegister() {
    $.ajax({
        url: "person/topRegisterCourse",
        async: false,
        dataType: "json",
        type: "POST",
        success: function (data) {
            var innerHtml = "";
            for (var i in data) {
                var dataTemp = data[i];
                var url = "course/userWatchCourse?id=" + data[i].id;
                var date = dataTemp.registerDate.substring(0, 10);
                innerHtml += getWatchCourseInnerHtml(url, dataTemp.photoUrl, dataTemp.courseName, date, "", 25, "register" + i);
            }
            $("#topRegister").html(innerHtml);
            $("#countRegister").html(data.length);
        },
        error: function () {
        }
    });
}

function initTopFriends(friendName, title) {
    $.ajax({
        url: "friend/listAllFriend",
        data: {
            friendName: friendName
        },
        async: false,
        dataType: "json",
        type: "POST",
        success: function (data) {
            var innerHtml = "";
            for (var i in data) {
                var friend = data[i];
                var fun = 'chatFriend(' + friend.friendId + ',\'' + friend.friendName + '\')';
                innerHtml += getInnerHtml(fun, friend.friendPhotoUrl, friend.friendName, friend.showOnLine, "", 25, "friend" + i);
            }
            $("#topFriends").html(innerHtml);
            $("#countFriend").html(data.length);
            $("#showCountFriend").html("" == title || undefined == title ? "你当前有" + data.length + "个好友" : "查询结果" + data.length);

        },
        error: function () {
        }
    });
}

function initTopInbox() {
    $.ajax({
        url: "inbox/listAllInbox",
        data: {
            state: -1,
            category: 1
        },
        dataType: "json",
        type: "POST",
        success: function (data) {
            var innerHtml = "";
            var count = 0;
            for (var i in data) {
                if (data[i].state != 1) {
                    count++;
                    var dataTemp = data[i];
                    var state = dataTemp.state;
                    var fun = 'checkMail(' + dataTemp.userId + ',' + dataTemp.addresseeId + ',' + dataTemp.id + ',\'' + dataTemp.content + '\',' + state + ',' + count + '); ';
                    var date = dataTemp.sendDate.substring(0, 10);
                    innerHtml += getInnerHtml(fun, dataTemp.user.userBaseInfo.photoUrl, dataTemp.user.userName, date, dataTemp.content, 40, "inbox" + i);
                }
            }
            $("#topInbox").html(innerHtml);
            $("#countInbox").html(count);
            $("#showCountInbox").html("你有" + count + "条信息未读");
        },
        error: function () {
        }
    });
}

function showDialog(url, title, data, width, height) {
    width = ("" == width || 100 >= width) ? 800 : width;
    $("#topDialog").width(width);
    $("#dialogTitle").text(title);
    $("#userEditIframe").height(height).attr("src", url + "?" + data);
    $("#modalDialog").modal("show");
}

function queryFriendList() {
    showDialog("friend/listAllFriendDo", "查询结果", "friendName=" + $("#queryMoreFriend").val().trim(), 1000, 400);
}

function changeMailState(id) {
    $.ajax({
        url: "inbox/changeMassageState",
        data: {
            id: id,
            state: 1
        },
        dataType: "json",
        type: "POST",
        success: function () {
            initTopInbox();
        },
        error: function () {
        }
    });
}

function checkMail(user_id, friend_id, id, content, state, i) {
    $("#inbox" + i).remove();
    var countInbox = $("#countInbox");
    countInbox.html(countInbox.html() - 1);
    changeMailState(id);
    switch (state) {
        case 0:
            alert(content);
            break;
        case 2:
            confirm(content, user_id, friend_id, id);
            break;
        case 3:
            alert(content);
            break;
    }
}

function dealFriendApply(id, friend_id, user_id, result) {
    var state = result ? 1 : 2;
    $.ajax({
        url: "friend/dealFriendApply",
        data: {
            id: id,
            userId: friend_id,
            friendId: user_id,
            state: state
        },
        dataType: "json",
        type: "POST",
        success: function () {
            if (result) {
                bootbox.alert("已加为好友！");
                initTopFriends("");
            } else {
                bootbox.alert("已拒绝添加该好友！");
            }
        },
        error: function (r) {
            if (result && r) {
                bootbox.alert("添加好友失败！");
            }
        }
    });
}

function confirm(content, user_id, friend_id, id) {
    bootbox.confirm(content, function (result) {
        dealFriendApply(id, friend_id, user_id, result);
    });
}

function alert(content) {
    bootbox.alert(content);
}

function initTop() {
    initTopRegister();
    initTopFriends("");
    initTopInbox();
}

function changeTopMessage() {
    initTopFriends("");
    initTopInbox();
}

function reLoad(src) {
    window.location.href = src;
}

function chatFriend(friendId, friendName) {
    showDialog("friend/chatWithFriendDo", "与" + friendName + "聊天中...", "friendId=" + friendId, 800, 400)
}

function initTopFriendSelect() {
    var friendSelect = $('#friendSelect');
    friendSelect.keyup(function (e) {
        initTopFriends(friendSelect.val().trim(), "查询结果");
    });
}

function uploadCourseDo() {
    showDialog("course/addCourseByUser", "上传课件", "", 600, 450);
}

function quit() {
    $("#userEditIframe").attr("src", "about:blank");
    parent.$("#modalDialog").modal("hide");
}

function getNowTime() {
    return format(new Date(), "yyyy-MM-dd hh:mm:ss");
}

function format(date, fmt) {
    var o = {
        "M+": date.getMonth() + 1,                 //月份
        "d+": date.getDate(),                    //日
        "h+": date.getHours(),                   //小时
        "m+": date.getMinutes(),                 //分
        "s+": date.getSeconds()                 //秒
    };
    if (/(y+)/.test(fmt))
        fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
    for (var k in o)
        if (new RegExp("(" + k + ")").test(fmt))
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
    return fmt;
}

function setHeight() {
    <shiro:hasRole name="用户">
    top.browserSizeDeal(document.documentElement.clientHeight + 92);
    $("#tabDiv").find("iframe")[0].contentWindow.browserSizeDeal(document.documentElement.clientHeight + 5);
    </shiro:hasRole>
    <shiro:hasAnyRoles name="管理员">
    $("#tabDiv").find("iframe")[0].contentWindow.browserSizeDeal(document.documentElement.clientHeight);
    </shiro:hasAnyRoles>
}

function initPhotoUrl() {
    $.ajax({
        url: "public/initPhotoUrl",
        dataType: "json",
        type: "POST",
        success: function (user) {
            $("#photoUrl").attr("src", user.userBaseInfo.photoUrl);
        },
        error: function () {
        }
    });
}
</script>


